<template>
  <div class="overview-content">
    <el-row :gutter="32">
      <el-col :xs="24" :sm="24" :lg="24" style="margin-bottom:20px;">
        <div class="chart-wrapper inputTop">
          <el-row :gutter="32" class="rowPda">
            <el-col :xs="24" :sm="8" :lg="4" class="flex">
              <el-input v-model="listQuery.content" placeholder="请输入搜索内容"  class="btnScr" :xs="24" :sm="12" :lg="16" />
              <!-- <el-button type="primary" icon="el-icon-search" class="btnScrright" :xs="24" :sm="12" :lg="8" @click="src">搜索</el-button> -->
            </el-col>
            <el-col :xs="24" :sm="8" :lg="3" class="agg">
              <el-select v-model="listQuery.createdBy" filterable  placeholder="请选择操作人" class="btnScr" clearable @change="src">
                <el-option
                  v-for="item in czRen"
                  :key="item.value"
                  :label="item.name"
                  :value="item.id"
                />
              </el-select>
            </el-col>
            <el-col :xs="24" :sm="8" :lg="3" class="agg">
              <!-- <el-input v-model="listQuery.mobile" placeholder="请输入电话" class="btnScr" :xs="24" :sm="12" :lg="16" /> -->
              <el-select v-model="listQuery.type"  clearable placeholder="请选择记录类别" :xs="24" :sm="12" :lg="16" class="w100" @change="src">
                <el-option
                  v-for="item in tel"
                  :key="item.value"
                  :label="item.name"
                  :value="item.value"
                />
              </el-select>
            </el-col>
            <el-col :xs="24" :sm="16" :lg="6" class="agg">
                    <el-date-picker
                      v-model="value1"
                      type="daterange"
                      style="width:100%"
                      @change="src"
                      clearable
                      range-separator="-"
                      start-placeholder="请选择操作时间"
                      end-placeholder="请选择操作时间">
                    </el-date-picker>
            </el-col>
            <el-col :xs="24" :sm="6" :lg="8" class="agg">
              <el-button class="add" @click="srcBtn(null)">筛选</el-button>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>


  </div>
</template>
<script>
import { genderFormat, getCodeToText } from '@/utils/common'
import { genderOptions, ownerSource } from '@/utils/consts'
import { list, getTagList } from '@/api/tag'
import {   pagelogSel} from '@/api/manager'
export default {
  components: {},
  data() {
    return {
      genderOptions,
      ownerSource,
      txt: '',
      show: false,
      value1:null,
      selectedOptions: [],
      listQuery: {
        page: 1,
        limit: 10,
        content: null,
        createdBy: null,
        type: null,
        startTime:null,
        endTime:null,
      },
      czRen:[],
      tel: [
        {name:"系统",value:0},
        {name:"人工",value:1},
      ],
      disabled: true,
    }
  },
  created() {
    // this.getRemoteTags()
  },
  mounted() {
    this.init()
  },
  methods: {
    init() {
      pagelogSel().then((response) => {
        this.czRen = response.data
      })
  //    filterMobile(0).then(response => {
        // this.arr = this.arr.concat(response.data)
       // this.tel = response.data
    //  })
    },
    src() {
      if(this.value1 !=null && this.value1 !=''){
        this.listQuery.startTime = this.value1[0]
        this.listQuery.endTime = this.value1[1]
      }else{
        this.listQuery.startTime = null
        this.listQuery.endTime = null
      }
      this.$emit('srcData', this.listQuery)
    },
    srcBtn() {
      if(this.value1 !=null && this.value1 !=''){
        this.listQuery.startTime = this.value1[0]
        this.listQuery.endTime = this.value1[1]
      }else{
                this.listQuery.startTime = null
        this.listQuery.endTime = null
      }
      this.$emit('srcData', this.listQuery)
    },
  }
}
</script>

<style lang="scss" scoped>
.add{background: #5AC6B7;color: #fff;border: 0;border-radius: 2px;}
.flex{display: flex;justify-content: space-between;align-items: center;padding-right: 8px!important;}
.btnScr{width: 100%;margin-bottom: 15px;}
::v-deep .btnScr input{border-radius:2px;}
.btnScrright{border-radius:2px;margin-top: -15px;}
.agg{padding-left:8px!important;padding-right: 8px!important;}
@media (max-width:1200px) {
.flex{display: flex;justify-content: space-between;align-items: center;padding-left:8px!important; padding-right: 8px!important;}
}
.myDigo h2{background: #343436;}
::v-deep .myDigo .el-dialog__footer{background: #E5E9ED;padding-top: 15px;}
::v-deep .el-dialog.myDigo .el-dialog__body{padding: 0;}
::v-deep .el-dialog.myDigo .el-dialog__header{display: none;}
.el-dialog.myDigo h2{height: 58px;display: flex;justify-content: space-between;align-items: center;padding-left: 39px;padding-right: 39px;color: #fff;font-size: 18px; padding-top: 0;
    margin-top: 0;overflow: hidden;font-weight: normal;font-family: 'SourceHanSansSC-regular';}
.el-dialog.myDigo h2 i{font-size: 26px;cursor: pointer;}
::v-deep  .el-dialog.myDigo  .el-dialog__body{text-align: left;}
.mtright{margin-right: 5px;}
::v-deep  .el-upload-list--picture-card .el-upload-list__item{width: 70px;height: 56px;}
::v-deep  .el-upload-list--picture-card .el-upload-list__item div.filediv{width: 100%;height: 100%;}
::v-deep  .el-upload--picture-card{width: 70px;height: 56px;line-height: 66px;}
::v-deep .el-upload__text{line-height: initial;color: #cacaca;margin-top: -10px;font-size: 12px;}
.right10{margin-left: 10px;}
.right20{margin-left: 20px;}
::v-deep .itxt label{font-weight: normal;font-size: 12px;}
::v-deep .itxt {margin-bottom: 15px;}
::v-deep .itxtactive label{color: #5AC6B7;}
.borbtoonline{border-bottom: 1px solid #f2f2f2;padding-bottom: -15px;}
.bortopline{margin-top: 15px;}
.borbtoonline .el-form-item{margin-bottom: 10px;}
.formDiv{padding-left: 39px;padding-right: 39px;}
.rowPda{padding-right: 10px;}
::v-deep .bd li{border-radius: 50%!important;width: 56px!important;}
::v-deep .inputY input{width: 240px;margin-right: 8px;line-height:36px;height:36px}
</style>

<style>
@media (min-width:1200px) {
        .inputTop input::-webkit-input-placeholder, textarea::-webkit-input-placeholder , select::-webkit-input-placeholder{
          font-size: 12px;
        }

        .inputTop input:-moz-placeholder, textarea:-moz-placeholder , select::-webkit-input-placeholder{
          font-size: 12px;
        }

        .inputTop input::-moz-placeholder, textarea::-moz-placeholder , select::-webkit-input-placeholder{
          font-size: 12px;
        }

        .inputTop input:-ms-input-placeholder, textarea:-ms-input-placeholder , select::-webkit-input-placeholder{
          font-size: 12px;
        }
}
</style>
